<template>
  <view class="container">
    <!--    <view class="form-box">-->
    <!--      <view class="download-box">-->
    <!--        <text class="titles">{{ activityName }}</text>-->
    <!--        <br/>-->
    <!--        <image :src="imageUrl" class="ewm"/>-->
    <!--        <br/>-->
    <!--        <text class="tips">{{ activityText }}</text>-->
    <!--        <u-button type="primary" size="medium" @click="toRegister" style="margin-top: 15px;">已入群,去注册</u-button>-->
    <!--      </view>-->
    <!--    </view>-->

    <u-card :title="activityName">
      <view class="" slot="body">
        <view class="u-body-item u-flex u-border-bottom u-col-between u-p-t-0">
          <!--          <view class="u-body-item-title u-line-2">瓶身描绘的牡丹一如你初妆，冉冉檀香透过窗心事我了然，宣纸上走笔至此搁一半</view>-->
          <u-image :src="imageUrl" width="100%" height="320px" mode="aspectFit"></u-image>
        </view>
        <!--        <view class="u-body-item u-flex u-row-between u-p-b-0">-->
        <!--          <view class="u-body-item-title u-line-2">釉色渲染仕女图韵味被私藏，而你嫣然的一笑如含苞待放</view>-->
        <!--          <image src="https://img12.360buyimg.com/n7/jfs/t1/102191/19/9072/330688/5e0af7cfE17698872/c91c00d713bf729a.jpg" mode="aspectFill"></image>-->
        <!--        </view>-->
      </view>
      <view class="" slot="foot">
        <view>
          <view class="u-body-item u-flex u-border-bottom u-col-between u-p-t-0 tips">
            <u-icon name="clock" size="34" color="" :label="startTime"></u-icon>
          </view>
          <view class="u-body-item u-flex u-border-bottom u-col-between u-p-t-0 tips">
            <u-icon name="clock-fill" size="34" color="" :label="endTime"></u-icon>
          </view>
          <view class="u-body-item u-flex u-border-bottom u-col-between u-p-t-0 tips">
            <u-icon name="chat-fill" size="34" color="" :label="activityText"></u-icon>
          </view>
        </view>
      </view>
    </u-card>

  </view>
</template>

<script>
import {mapGetters} from "vuex";

export default {
  name: "activit",
  data() {
    return {
      imageUrl: null,
      activityText: "",
      activityName: "",
      activityStartTime: '',
      activityEndTime: '',
      iframePath: "",
      isShowGuide: false,
      isShowGuide1: false,
      deptId: null,
    };
  },
  computed: {
    startTime(){
      return '活动开始时间: ' + this.activityStartTime
    },
    endTime() {
      return '活动结束时间: ' + this.activityEndTime
    }
  },
  onReady() {
    this.deptId = this.getRequestParam().deptId
    console.log('deptId', this.deptId)
    this.getActivitys()
  },
  methods: {
    async getActivitys() {
      try {
        let {data} = await this.$api.activity.getActivity({companyId: this.deptId});
        this.imageUrl = data.imageUrl
        this.activityText = data.activityText
        this.activityName = data.activityName
        this.activityStartTime = data.activityStartTime
        this.activityEndTime = data.activityEndTime
      } catch (e) {
        this.toRegister()
      }

    },
    toRegister() {
      this.$u.route("pages/verify/index");
    },
    // 获取URL Query参数
    getRequestParam() {
      const urlParams = {}
      const url = window.location.href
      const afterUrl = url.split('#')[0]
      const getParamUrl = afterUrl || url
      const queryParamsStr = getParamUrl.split('?')[1]
      if (queryParamsStr) {
        const queryParams = queryParamsStr.split('&')
        for (let i = 0; i < queryParams.length; i++) {
          const splitItem = queryParams[i].split('=')
          urlParams[splitItem[0]] = splitItem[1]
        }
      }
      return urlParams
    }
  }
}
</script>

<style lang="scss" scoped>
.container {
  width: 100%;
  height: 100%;
  overflow: hidden;
  .tips {
    margin-top: 5px;
    margin-bottom: 5px;
  }
}

//uni-page-body,
//uni-view {
//  height: 100%;
//}
//
//.download-box {
//  position: absolute;
//  left: 50%;
//  top: 20%;
//  transform: translate(-50%, -50%);
//  width: 200px;
//  height: 200px;
//
//  image {
//    display: block;
//    width: 100%;
//    height: 100%;
//  }
//
//  .titles {
//    display: block;
//    width: 100%;
//    text-align: center;
//    color: red;
//    font-size: 17px;
//    margin-top: 10px;
//  }
//
//  .tips {
//    display: block;
//    width: 100%;
//    text-align: center;
//    color: red;
//    font-size: 12px;
//    margin-top: 10px;
//  }
//}
//
//.iframe {
//  height: 85vh;
//}
//
//
//.form-box {
//  padding: 20px;
//}
//
//.custom-btn {
//  margin: 15px auto;
//  left: 50%;
//  transform: translateX(-50%);
//}
</style>
